<template>
	<uni-popup type='bottom' v-show='show' :mask-click="false" ref='weipai'>
		<view class="weipai">
			<image src="@/static/statc-icon/close.png" class='icon' @tap='handleClosePopup' mode=""></image>
			<view class="header">
				商品流转
			</view>

			<view class="content">
				<image :src="goodsInfo.imageUrl" class='prodImage' mode=""></image>
				<view class="left">
					<view class="titlePopup elliptical2">
						{{goodsInfo.goodsName}}
					</view>
					<view class="options-poup">
						<view class="countDown">
							<!-- <image src="@/static/statc-icon/image-10.png" class='updownicon' @click="upDown('down')"
								mode=""></image> -->
							数量：
							<view class="num">
								{{goodsInfo.quantity}}
							</view>
							<!-- <image src="@/static/statc-icon/image-9.png" class='updownicon' @click="upDown('up')"
								mode=""></image> -->
						</view>

						<!-- 	<view class="allbtn-popup">
							全部
						</view> -->
					</view>

					<view class="pricePopup" v-if='goodsInfo.nowPrice'>
						{{goodsInfo.nowPrice}}
					</view>

				</view>

			</view>
			<view class="popupBtn" @click='handleSellGoods0214'>
				确认并委托流转
			</view>
		</view>

	</uni-popup>
</template>

<script>
	import {
		sellGoods0214
	} from "@/api/api.js"

	export default {
		name: 'liuzhuanpopup',
		props: {
			goodsInfo: {
				type: Object,
				default: () => {}
			},
			show: {
				type: Boolean,
				default: false
			},
			// callBack:{
			// 	type:Function,
			// }
		},
		data() {
			return {

			}
		},
		watch: {
			show(newVal) {
				if (newVal) {
					this.$refs.weipai.open('bottom')
				} else {
					this.$refs.weipai.close()
				}
			}
		},
		methods: {
			handleClosePopup() {
				this.$emit('close')
			},
			handleSellGoods0214() {
				if (Number(this.$props.goodsInfo.quantity) <= 0) {
					uni.showToast({
						title: '请选择正确的交易数量',
						icon: 'none'
					})
					return
				}
				this.$emit('close')
				this.$emit("sure",this.$props.goodsInfo.id)
			}
			// handleSellGoods0214() {
			// 	if(this.num<=0){
			// 		uni.showToast({
			// 			title:'请选择正确的交易数量',
			// 			icon:'none'
			// 		})
			// 		return
			// 	}
			// 	sellGoods0214({
			// 		goodsId: this.goodsInfo.id,
			// 		quantity: this.goodsInfo.quantity
			// 	}).then(res => {
			// 		console.log('sellGoods0214', res)
			// 		if (res.code == 200) {

			// 			uni.showToast({
			// 				title: '操作成功',
			// 				icon: 'none',

			// 			})
			// 			this.$emit('close')
			// 			this.$emit("sure")

			// 		} else {
			// 			uni.showToast({
			// 				title: res.msg,
			// 				icon: 'none',
			// 			})
			// 		}

			// 	})
			// },
		}

	}
</script>

<style lang="less" scoped>
	.weipai {
		width: 100%;
		height: 556rpx;
		background: #FFFFFF;
		position: relative;
		border-top-right-radius: 50rpx;
		border-top-left-radius: 50rpx;

		.icon {
			width: 48rpx;
			height: 48rpx;
			position: absolute;
			top: 32rpx;
			right: 46rpx;
		}

		.header {
			width: 100%;
			height: 88rpx;
			background: #FFFFFF;
			box-shadow: 0px 2rpx 2rpx 0px rgba(167, 167, 167, 0.25);
			padding: 16rpx 40rpx;
			box-sizing: border-box;
			// border-bottom: 2rpx solid #A7A7A7;
			display: flex;
			align-items: center;
			border-top-right-radius: 50rpx;
			border-top-left-radius: 50rpx;
		}

		.content {
			display: flex;
			padding: 40rpx;

			.prodImage {
				width: 200rpx;
				height: 200rpx;
				border-radius: 8rpx;
				margin-right: 20rpx;
			}

			.left {
				flex: 1;
				display: flex;
				flex-direction: column;
				font-weight: bold;
				font-size: 28rpx;
				color: #3C3C3C;

				.titlePopup {
					font-weight: bold;
					font-size: 28rpx;
					color: #3C3C3C;
					margin-bottom: 20rpx;
					line-height: 40rpx;
				}

				.options-poup {
					display: flex;
					align-items: center;

					.allbtn-popup {
						width: 124rpx;
						height: 48rpx;
						background: #FC365E;
						border-radius: 40rpx;
						font-weight: bold;
						font-size: 24rpx;
						color: #FFFFFF;
						display: flex;
						justify-content: center;
						align-items: center;
						margin-left: 20rpx;
					}
				}

				.countDown {
					display: flex;
					align-items: center;

					.num {
						width: 132rpx;
						height: 56rpx;
						background: #FFFFFF;
						border: 2rpx solid #F7F7F7;
						display: flex;
						align-items: center;
						justify-content: center;
						font-weight: bold;
						font-size: 32rpx;
						color: #000000;
					}

					.updownicon {
						width: 56rpx;
						height: 56rpx;

					}
				}

				.pricePopup {
					font-weight: bold;
					font-size: 40rpx;
					color: #FF3C2D;
					margin-top: 20rpx;
				}

				.pricePopup:before {
					content: "预售￥";
					font-weight: bold;
					font-size: 20rpx;
					color: #FF3C2D;
				}

			}
		}

		.popupBtn {
			width: 670rpx;
			height: 88rpx;
			background: linear-gradient(90deg, #FF7A3F 0%, #FC3260 100%);
			border-radius: 112rpx;
			margin: 0 auto;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
</style>